<template>
  <div class="nav-wrapper">
    <div class="nav-item_box" v-for="item in navList" :key="item.id">
      <div class="nav-title">
        <span>{{ item.grou }}</span>
      </div>
      <div class="nav-content">
        <div class="nav-content_item" v-for="items in item.children" :key="items.id">
          <a :href="items.url" target="_blank"></a>
          <div class="logo">
            <img v-if="items.imgUrl" :src="items.imgUrl" alt="" />
            <span>{{ items.title }}</span>
          </div>
          <div class="desc">{{ items.description }}</div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import api from '../../../api/nav'
export default {
  data() {
    return {
      navList: []
    }
  },
  methods: {
    // 获取导航列表
    async getNavList() {
      try {
        const res = await api.getNavList()
        if (res.code === 200) {
          this.navList = res.data
        }
      } catch (err) {
        console.log(err)
      }
    }
  },
  mounted() {
    this.getNavList()
  }
}
</script>
